<div id="app">
    <ui-prop>
        <ui-label slot="label" tooltip="以标识命名的节点会被导出到脚本">导出标识</ui-label>
        <ui-input slot="content" v-model="flag_input"></ui-input>
    </ui-prop>
    <ui-prop>
        <ui-label slot="label" tooltip="导出的脚本添加@property">添加@property</ui-label>
        <ui-checkbox slot="content" :value="exportProperty" @click="onClickExportProperty"></ui-checkbox>
    </ui-prop>
    <ui-prop>
        <ui-label slot="label" tooltip="脚本自动getChild，getComponet">自动bind组件</ui-label>
        <ui-checkbox slot="content" v-model="bindComp" @click="onClickBindComp"></ui-checkbox>
    </ui-prop>
    <ui-section class="config" header="组件导出缩写" expand>
        <div id="config_top_div">
            <ui-button :style="{visibility: mgr_model_hide}" @click="onClickAdd"> 添加 </ui-button> <ui-label id="add_tips">{{ add_tips }}</ui-label>
            <ui-checkbox id="checkbox_all" :style="{visibility: mgr_model_show}" v-model="del_select_all" @click="onClickDelSelectAll"> 全选 </ui-checkbox>
            <ui-button id="btn_right" @click="onClickBtnMgr"> 管理 </ui-button>
            <ui-button id="btn_del" :style="{visibility: mgr_model_show}" @click="onClickDelect"> 删除 </ui-button>
        </div>
        <div id="config_bot_div">
            <!-- 列出所有已有的配置 -->
            <ui-prop v-for="item, index in compFlags">
                <!-- 选择组件并进行配置 -->
                <ui-checkbox slot="label" v-model="del_select[index]" :style="{visibility: mgr_model_show}" @click="onClickDelSelect($event, index)"></ui-checkbox>
                <select v-model="item.key" slot="label" @change="onSelectChange"> 
                    <!-- 这一个选项只是为了select能显示默认值 所以直接隐藏 -->>
                    <option :value=item.key style="visibility:hidden; font-size: 0;">{{ item.key }}</option>
                    <option v-for="compName in compList" :value=compName>{{ compName }}</option>
                </select>
                <ui-input slot="content" v-model=item.value></ui-input>
                <ui-label id="err_tip" :value="err_tips[index]" :style="{visibility: (err_tips[index] && err_tips[index].length > 0? 'visible': 'hidden')}"></ui-label>
                <!-- 选择组件并进行配置 end -->
            </ui-prop>
            <!-- {{ selectKey }} -->
            <!-- 列出所有已有的配置 end-->
        </div>
    </ui-section>
    <div id="div_save">
        <ui-button id="btn_save" @click="onClickSave"> 保存 </ui-button>
        <ui-label id="save_tips">{{ save_tips }}</ui-label>
        <ui-label id="save_err">{{ save_err }}</ui-label>
    </div>
</div>